import React from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { message, Popconfirm, Button } from 'antd'
import { newBlog, updateBlog, deleteBlog } from "../../store/blog.redux"

class MarkDownBottomSend extends React.Component {
    checkContent() {
        const { BlogReducer } = this.props
        const { content, title, doType } = BlogReducer
        if (title === '') {
            message.error('标题为空')
            return
        }
        if (content === '') {
            message.error('内容为空')
            return
        }
        // 判断类型：添加 还是 更新
        if (doType === 'add') {
            this.props.newBlog(BlogReducer)
        } else {
            this.props.updateBlog(BlogReducer)
        }
    }

    deleteArticle() {
        const { BlogReducer } = this.props
        const { id, doType } = BlogReducer
        if (doType === 'add') {
            message.error('发生错误')
        }
        this.props.deleteBlog(id)
    }

    cancel() {
        return
    }

    render() {
        const { BlogReducer } = this.props
        return (
            <div>
                <Button type="primary" style={{ margin: '0 15px 0 0' }} onClick={
                    () => this.checkContent()
                }>
                    {BlogReducer.doType === 'add' ? '发布' : '更新'}
                </Button>
                <Popconfirm title="你确定要删除这篇文章吗?" onConfirm={(e) => this.deleteArticle(e)}
                    onCancel={(e) => this.cancel(e)} okText="是" cancelText="否">
                    <Button type={BlogReducer.doType === 'add' ? null : 'danger'}>
                        {BlogReducer.doType === 'add' ? '取消' : '删除'}
                    </Button>
                </Popconfirm>
                <style jsx>{`
                 div {
                    margin: 10px 0 0 0;
                 }
              `}</style>
            </div>
        )
    }
}

const mapStateToProps = ({ BlogReducer }) => ({ BlogReducer })
const mapDispatchToProps = (dispatch) => {
    return {
        newBlog: bindActionCreators(newBlog, dispatch),
        updateBlog: bindActionCreators(updateBlog, dispatch),
        deleteBlog: bindActionCreators(deleteBlog, dispatch)
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(MarkDownBottomSend)